<!doctype html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
  <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
  <title>开通存款账户</title>
  <link rel="stylesheet" type="text/css" href="./css/api.css" />
  <link rel="stylesheet" type="text/css" href="./css/aui.css" />
  <link rel="stylesheet" type="text/css" href="./css/font-awesome.min.css" />
  <link rel="stylesheet" type="text/css" href="./css/styleold.css" />
  <script type="text/javascript" src="./script/api.js"></script>
  <script type="text/javascript" src="./script/aui-tab.js" ></script>
  <link rel="stylesheet" type="text/css" href="./css/aui-slide.css" />
  <script type="text/javascript" src="./script/aui-slide.js"></script>
  <script type="text/javascript" src="./script/base.js"></script>
  <script type="text/javascript" src="./script/jquery-3.2.0.js"></script>
  <script type="text/javascript">
    function closeFrame(){
     api.setFrameGroupIndex({
      name: 'nav',
      index: 2,
      reload: true,
    });
     var setSele = 'changeSelect();';
     api.execScript({
      name: 'home',
      script: setSele,
    });
     api.closeFrame({
       name: 'bank'
     });
   };
 </script>
</head>
<body>
 <!-- 头部 -->
 <!-- <header class="aui-bar aui-bar-nav" id="topbar">开户</header> -->
 <!-- <header class="aui-bar aui-bar-nav"> -->
<!--  <a class="aui-pull-left aui-btn" onclick="closeFrame()">
  <span class="aui-iconfont aui-icon-left"></span>
</a>
<div class="aui-title">开通存款账户</div>
</header> -->
<form id="bankForm" action="http://www.big-wealth.com/index.php?ctl=hrb&act=userRegister" method="post">
  <div class="bank">
    <ul>
      <input type="hidden" name="bankName" id="hideBankName">
      <input type="hidden" name="agent" value="h5">
      <input type="hidden" name="userid" id="userid">
      <!-- <input type="hidden" name="mobile_no" id="mobile_no"> -->
      <li>
        <label>姓名</label>
        <input name="cust_nm" type="text" class="text1" id="username" placeholder="请输入持卡人姓名">
        <div class="check" id="checkName"></div>
      </li>
      <li>
        <label>身份证</label>
        <input name="certif_id" type="text" class="text1" id="idCard" placeholder="请输入身份证号">
        <div class="check" id="checkID"></div>
      </li>
      <li>
        <label>借记卡</label>
        <input name="capAcntNo" type="text" class="text1" id="bankNumber" placeholder="请输入银行卡号">
        <div class="check" id="checkBankNum"></div>
      </li>
      <!-- 选择银行后 -->
      <li class="bank-s" onclick="chooseBank();" id="afterBank">
        <i class="HRB" id="afterClass"></i>
        <p  id="aferName">哈尔滨银行</p>
        <span class="fa fa-angle-right"></span>
      </li>
      <!-- 选择银行前 -->
      <li class="bank-s" onclick="chooseBank();" id="beforeBank">
        <p>请选择银行</p>
        <span class="fa fa-angle-right"></span>
        <div class="check" id="checkBank"></div>
      </li>
    </ul>
    <ul>
      <li>
        <label>手机号</label>
        <input name="mobile_no" type="text" class="text1" id="mobileNumber" placeholder="请输入手机号">
        <div class="check" id="checkMobile"></div>
      </li>
<!--         <li>
            <label>验证码</label>
            <input type="text" class="text2">
            <input type="submit" class="btn2" value="获取验证码">
          </li> -->
<!--           <li>
            <div class="aui-list-item-inner">
              <div class="aui-list-item-label">
                验证码
              </div>
              <div class="aui-list-item-input">
                <input type="text" class="text" placeholder="请输入验证码" onkeyup="checkCaptcha();" id="sms_code">
                <div type="submit" class="aui-btn" onclick="sendCaptcha();" id="sendCodeBtn">发送验证码</div>
                <div class="check" id="checkCaptcha"></div>
              </div>
            </div>
          </li> -->
        </ul>
        <!-- <button type="button" >确认</button> -->
        <button type="button" class="active" onclick="openAccount()">确认</button>
        <div class="bank-d">注册手机号和银行卡预留手机号必须一致</div>
      </div>
    </form>
  </body>
  <script type="text/javascript">

    apiready = function(){

      lastCaptcha = '';

      // 手机号码
      // var mobileM = $api.getStorage('mobileM');
      // var mobileEle = $api.byId('mobile');
      // mobileEle.innerText = mobileM;

      // 银行
      var bank = $api.getStorage('bank');
      var bankName = $api.getStorage('bankName');
      var user_id = $api.getStorage('userid');

      // 给开户行名称隐藏域赋值
      if (bankName) {
        var hideBankName = document.getElementById("hideBankName");
        hideBankName.value = bankName;
      }

      // 给用户id隐藏域赋值
      var userid = document.getElementById("userid");
      userid.value = user_id;
      // 给用户手机号隐藏域赋值

      // var mobile = $api.getStorage('mobile');
      // var mobile_no = document.getElementById("mobile_no");
      // mobile_no.value = mobile;

      if (bank) {
        var bankClass = document.getElementById("afterClass");
        bankClass.className = bank;

        var bankNameClass = document.getElementById("aferName");
        bankNameClass.innerText = bankName;

        $("#beforeBank").hide();
        $("#afterBank").show();
        $api.setStorage('bank', '');
      }else{
        $("#afterBank").hide();
        $("#beforeBank").show();
      }
    }

    //  选择银行
    function chooseBank(){
      var delay = 0;
      if(api.systemType != 'ios'){
        // delay = 300;
      }

      var backUrl = api.pageParam.backUrl;

      if (backUrl == 'user') {
        api.openWin({
          name: 'bank-list',
          url: './bank-list.html',
          bounces:false,
          delay: delay,
          slidBackEnabled:true,
          vScrollBarEnabled:false,
          progress:{
            type:"page"
          },
          pageParam: {
            backUrl: 'user'
          },
        });
      }else{

        api.openWin({
          name: 'bank-list',
          url: './bank-list.html',
          bounces:false,
          delay: delay,
          slidBackEnabled:true,
          vScrollBarEnabled:false,
          progress:{
            type:"page"
          },
        });
      }
    }

    // 开户
    function openAccount(){

      var name = $api.byId('username');
      var username = name.value;
      // 持卡人姓名不能为空
      if (!username) {
        $api.byId('checkName').innerText = '持卡人姓名不能为空';
        return false;
      }else{
        $api.byId('checkName').innerText = '';
      }

      var id = $api.byId('idCard');
      var idCard = id.value;
      // 身份证号码不能为空
      if (!idCard) {
        $api.byId('checkID').innerText = '身份证号码不能为空';
        return false;
      }else{
        $api.byId('checkID').innerText = '';
        var reg = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;
        if(reg.test(idCard) === false)
        {
          $api.byId('checkID').innerText = '身份证格式不正确';
          return  false;
        }
        $api.byId('checkID').innerText = '';
      }

      var bank = $api.byId('bankNumber');
      var bankNumber = bank.value;
      // 银行卡号不能为空
      if (!bankNumber) {
        $api.byId('checkBankNum').innerText = '银行卡号不能为空';
        return false;
      }else{
        $api.byId('checkBankNum').innerText = '';
      }

      var bankName = $api.getStorage('bankName');
      // 银行不能为空
      if (!bankName) {
        $api.byId('checkBank').innerText = '请选择银行';
        return false;
      }else{
        $api.byId('checkBank').innerText = '';
      }

      var mobile = $api.byId('mobileNumber');
      var mobileValue = mobile.value;
      var re = /^1\d{10}$/
      if (re.test(mobileValue)) {
        $api.byId('checkMobile').innerText = '';
      }else{
        $api.byId('checkMobile').innerText = '请输入正确的手机号码';
        return false;
      }

      // // 验证验证码
      // var sms_code = $api.byId('sms_code');
      // var sms_codeValue = sms_code.value;
      // if (!sms_codeValue) {
      //   $api.byId('checkCaptcha').innerText = '验证码错误';
      //   return false;
      // }

      // 提交表单
      var form = document.getElementById("bankForm");
      form.submit();

    }
  </script>
  </html>
